今天要來介紹箭頭函式了~~簡單來說，方便的東西，但有不少陷阱!

要注意的地方

1. 首先，他沒有 arguments[註1]、super[註2]。
2. 因為沒有建構式的屬性，所以無法 new 來呼叫箭頭函式。
3. 無法使用 new 來呼叫，所以也沒有原型
4. 在函式中使用的 this 指得與傳統函式的 this 不同。

基礎使用

從樣子看來就是把 function 拿掉改用箭頭。

let fun1 = function(參數){
    console.log('我是傳統函式');
}
let fun2 = (參數) => {
    console.log('我是箭頭函式');
}

假如只需一行的話

let fun3 = () => console.log('我是單行的箭頭函式');

this 的處理

傳統函式在 this 上雖然通常指的是呼叫 function 的物件，但還是要根據上下文來判斷。
箭頭函式的 this 因為不會產生作用域，所以指的是上層的 this，通常會被指向 window。(通常啦...

var name = "基德";
var nameObj = {
    name: "亮",
    obj1: function(){
        console.log("1", this); // nameObj 物件
        console.log("2", this.name); // 亮
    },
    obj2: () => {
        console.log("3", this); // window
        console.log("4", this.name); // 基德
    }
}

假如有括號包著讓他擁有作用域的話

var name = "基德";
var nameObj = {
    name: "亮",
    obj() {
        setTimeout(() => {
            console.log(this); // nameObj 物件
            console.log(this.name); // 亮
        }, 100)
    }
}
nameObj.obj();

是不是覺得一不小心就會掉入陷阱之中呢?假如還不熟悉的話就繼續用傳統的函式吧~

註1：argument 指的是「引數」，意思是函式被呼叫時所帶入的參數。而 arguments 是所有引數的集合，以「類似」陣列的型態顯示，因為無法使用 JavaScript 的陣列屬性，所以又稱為「類陣列」。

註2：其實這個我也不熟...不過根據 Understanding ECMAScript 6 的說明，似乎能使 JS 的原型更方便操作。